<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" lang="ru">

<head><title>Video content</title>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
    <link href="css/common.css" rel="stylesheet" type="text/css">
</head>

<body>
<f:view>
<f:loadBundle basename="ResourceBundle" var="bundle"/>
<h:form id="videoContentForm">
<div id="external">
<div id="menu">
    <h:outputText value="#{bundle.menu_title}"/>
    <br>
    <%@ include file="menu.jsp" %>
</div>
<div id="languages">
    <div class="internal-languages">
        <strong>
            <h:commandLink value="EN"/>
            <h:commandLink value="HI"/>
            <h:commandLink value="TAM"/>
        </strong>
    </div>
</div>


<div id="content">
    <div id="title"> ${bundle.ad_video_content_header}</div>

    <div id="top-left-filters">
        <br>
        <h:outputText value="#{bundle.find_content_by_id}"/>
        <h:inputText value="#{videoContentBean.filterId}" style="width: 50px"/>
        <h:commandButton value="#{bundle.ok_button}"
                         actionListener="#{videoContentBean.findVideoContentById}" style="width: 50px"/>

        <br>
        <h:outputText value="#{bundle.find_content_by_name}"/>
        <h:inputText value="#{videoContentBean.filterName}"/>
        <h:commandButton value="#{bundle.ok_button}"
                         actionListener="#{videoContentBean.findVideoContentByName}" style="width: 50px"/>

        <br>
        <h:outputText value="#{bundle.find_content_by_advertiser}"/>
        <h:inputText style="width: 100px" value="#{videoContentBean.filterAdvertiser}"/>
        <h:commandButton value="#{bundle.ok_button}"
                         actionListener="#{videoContentBean.findVideoContentByAdvertiser}" style="width: 50px"/>
    </div>

    <div id="top-right-filters">
        <br>
        <h:outputText value="#{bundle.rowCountOnPage}"/>
        <h:inputText style="width: 100px" value="#{videoContentBean.rows}"/>
        <h:commandButton actionListener="#{videoContentBean.restrictRows}" value="#{bundle.ok_button}"
                         style="width: 50px"/>
        <br>
        <h:outputText value="#{bundle.fullRowCount}"/>
        <h:inputText value="#{videoContentBean.rowCount}" style="width: 100px" readonly="true"/>
        <br>
    </div>

    <div id="data-table">
        <h:dataTable value="#{videoContentBean.videoContents}" var="videoContent" border="1" width="100%"
                     headerClass="table-header">
            <h:column>
                <f:facet name="header">
                    <h:outputText value="ad_ID"/>
                </f:facet>
                <h:outputText value="#{videoContent.adID}"/>
            </h:column>

            <h:column>
                <f:facet name="header">
                    <h:outputText value="Category"/>
                </f:facet>
                <h:outputText value="#{videoContent.category}"/>
            </h:column>

            <h:column>
                <f:facet name="header">
                    <h:outputText value="Name"/>
                </f:facet>
                <h:outputText value="#{videoContent.name}"/>
            </h:column>

            <h:column>
                <f:facet name="header">
                    <h:outputText value="Advertiser"/>
                </f:facet>
                <h:outputText value="#{videoContent.advertiser}"/>
            </h:column>

            <h:column>
                <f:facet name="header">
                    <h:outputText value="Description"/>
                </f:facet>
                <h:outputText value="#{videoContent.description}"/>
            </h:column>

            <h:column>
                <f:facet name="header">
                    <h:outputText value="Viewing groups"/>
                </f:facet>
                <h:outputText value="#{videoContent.viewingGroups}"/>
            </h:column>

            <h:column>
                <f:facet name="header">
                    <h:outputText value="Regions"/>
                </f:facet>
                <h:outputText value="#{videoContent.regions}"/>
            </h:column>

            <h:column>
                <f:facet name="header">
                    <h:outputText value="Budget"/>
                </f:facet>
                <h:outputText value="#{videoContent.budget}"/>
            </h:column>

            <h:column>
                <f:facet name="header">
                    <h:outputText value="Remaining"/>
                </f:facet>
                <h:outputText value="#{videoContent.remaining}"/>
            </h:column>

            <h:column>
                <f:facet name="header">
                    <h:outputText value="PayPerView"/>
                </f:facet>
                <h:outputText value="#{videoContent.payPerView}"/>
            </h:column>

            <h:column>
                <f:facet name="header">
                    <h:outputText value="Status"/>
                </f:facet>
                <h:outputText value="#{videoContent.status}"/>
            </h:column>

            <h:column>
                <f:facet name="header">
                    <h:outputText value="Edit"/>
                </f:facet>
                <h:commandButton value="#{bundle.edit_button}"
                                 action="#{videoContentBean.editVideoContent}">
                    <f:param name="edit_video_id" value="#{videoContent.adID}"/>
                </h:commandButton>
            </h:column>

            <h:column>
                <f:facet name="header">
                    <h:outputText value="Delete"/>
                </f:facet>
                <h:commandButton value="#{bundle.delete_button}"
                                 actionListener="#{videoContentBean.deleteVideoContent}">
                    <f:param name="delete_video_id" value="#{videoContent.adID}"/>
                </h:commandButton>
            </h:column>
        </h:dataTable>
    </div>

    <div id="page-navigation">${bundle.navigation}</div>
    <div style="position:absolute;top: 55%; height: 5%; right: 5%">
        <h:commandButton value="#{bundle.addContentButton}" action="#{videoContentBean.toAddVideoContent}"/>
    </div>

    <div style="position: absolute;clear: left; background-color:#7ccff5; bottom: 27%; height: 8%; left:2%;right: 2%;">
        <strong>
            <h:outputText value="#{bundle.choosing_by_region}"/>
        </strong>
        <h:selectManyCheckbox value="#{videoContentBean.chosenFilterRegions}" style="width: 100%">
            <f:selectItems value="#{videoContentBean.regions}"/>
        </h:selectManyCheckbox>
    </div>

    <div id="categories-filters">
        <strong><h:outputText value="#{bundle.choosing_by_category}"/></strong>

        <div style="height:60%; overflow-y:scroll; word-wrap:break-word">
            <h:panelGrid columns="2">
                <h:selectManyCheckbox layout="pageDirection"
                                      value="#{videoContentBean.chosenFilterCategories}">
                    <f:selectItems value="#{videoContentBean.categories}"/>
                </h:selectManyCheckbox>
            </h:panelGrid>
        </div>
        <div style="height:20pt">
            <h:panelGrid columns="2">
                <h:commandButton value="#{bundle.checkAllButton}"
                                 actionListener="#{videoContentBean.checkAllCategories}"/>
                <h:commandButton value="#{bundle.uncheckAllButton}"
                                 actionListener="#{videoContentBean.clearAllCategories}"/>
            </h:panelGrid>
        </div>
    </div>

    <div id="statuses-filters">
        <div id="statuses-filters-inside">
            <h:outputText value="#{bundle.choosing_by_status}:"/>
            <h:selectOneMenu value="#{videoContentBean.chosenStatus}"
                             valueChangeListener="#{videoContentBean.filterByStatus}"
                             onchange="submit()">
                <f:selectItems value="#{videoContentBean.statuses}"/>
            </h:selectOneMenu>
        </div>
    </div>

    <div id="budget-filter">
        <div id="budget-filter-inside">
            <h:outputText value="#{bundle.choosing_by_budget}:"/>
            <h:panelGrid columns="2">
                <h:outputText value="from"/>
                <h:inputText value="#{videoContentBean.from}"/>
            </h:panelGrid>
            <h:panelGrid columns="2">
                <h:outputText value="to"/>
                <h:inputText value="#{videoContentBean.to}"/>
            </h:panelGrid>
            <h:commandButton value="#{bundle.ok_button}"
                             actionListener="#{videoContentBean.findVideoContentByGroupsRegionsStatusBudget}"/>
        </div>
    </div>
</div>
</div>
</h:form>
</f:view>
</body>
</html>
